<template>
  <div class="app-container">
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5" :push="12">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['drugs:drmaintain:add']">添加药品
        </el-button>
      </el-col>
      <el-col :span="1.5" :push="12">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['system:check:edit']"
        >批量设置
        </el-button>
      </el-col>
      <el-col :span="1.5" :push="12">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="submitForm"
          v-hasPermi="['system:check:remove']"
        >暂存
        </el-button>
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['system:check:edit']"
        >提交审核
        </el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getLists"></right-toolbar>
    </el-row>

    <!--  Select 选择器  -->
    <el-form :model="DrugsUnitList[0]" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
      <el-col :span="8">
        <el-form-item label="单据号" prop="stoPurId">
          <el-input v-model="DrugsUnitList[0].stoPurId" readonly clearable/>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="制单人" prop="purPel">
          <el-input v-model="DrugsUnitList[0].purPel" readonly clearable/>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="供应商" prop="purSlrName">
          <el-select v-model="queryParams.purSlrName" placeholder="请选择供应商" clearable>
            <el-option
              v-for="dict in dict.type.drugs_pureceiptlist_supplier"
              :key="dict.value"
              :label="dict.label"
              :value="dict.value"
            />
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="时间选择" prop="createTime">
          <el-time-picker type="datetime" v-model="forms.createTime" format="yyyy-MM-dd HH:mm:ss"
                          value-format="yyyy-MM-dd HH:mm:ss"
                          :style="{width: '100%'}" placeholder="请选择时间选择"></el-time-picker>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="总批发额" prop="purNumprice">
          <el-input v-model="DrugsUnitList[0].purNumprice" readonly/>
        </el-form-item>
      </el-col>
    </el-form>

    <el-table v-loading="loading" :data="DrugsUnitList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="50" align="center"/>
<!--      <el-form ref="forms" :model="forms" label-width="80px" label="计数器" prop="stoNumbers">-->
<!--        <el-form-item label="计数器" prop="stoNumbers">-->
<!--          <el-input-number v-model="forms.stoNumbers"></el-input-number>-->
<!--        </el-form-item>-->
<!--      </el-form>-->
      <el-table-column prop="drmId" label="药品ID" width="90" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column prop="drmName" label="药品名称" width="100" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column prop="stoNorms" label="规格" width="80" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column prop="producerName" label="生产厂家" width="100" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column prop="stoNumbers" label="数量" width="80" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column prop="drmUnit" label="单位" width="80" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column prop="stoPrice" label="批发价" width="80" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column prop="purNumprice" label="批发额" width="80" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column prop="purNumprice" label="批次号" width="80" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column prop="renamrk" label="备注" width="80" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['drugs:pureceipt:removes']"
          >删除
          </el-button>
        </template>
      </el-table-column>
      <!--      <el-form-item label="金额" prop="stoNumber" width="100">-->
      <!--        <el-input-number  placeholder="金额"></el-input-number>-->
      <!--      </el-form-item>-->
    </el-table>
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getLists"
    />

    <!-- 添加或修改费用对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="750px" append-to-body style="text-align: center">
      <el-form ref="form" :model="form" label-width="80px">
        <el-col :span="8">
          <el-form-item label="关键字" prop="drmKeyword">
            <el-input v-model="form.drmKeyword" placeholder="请输入关键字"/>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="药品类型" prop="drmType">
            <el-select v-model="queryParams.drmType" placeholder="请选择药品类型" clearable>
              <el-option
                v-for="dict in dict.type.drugs_drmaintain_type"
                :key="dict.value"
                :label="dict.label"
                :value="dict.value"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="处方类型" prop="drmPrescription">
            <el-select v-model="queryParams.drmPrescription" placeholder="请选择处方类型" clearable>
              <el-option
                v-for="dict in dict.type.drugs_drmaintain_prescription"
                :key="dict.value"
                :label="dict.label"
                :value="dict.value"
              />
            </el-select>
          </el-form-item>
        </el-col>
      </el-form>
      <el-table v-loading="loading" :data="drmaintainList" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="50" align="center"/>
        <el-table-column label="药品ID" align="center" prop="drmId" width="90"/>
        <el-table-column label="药品名称" align="center" prop="drmName" width="80"/>
        <el-table-column label="药品编码" align="center" prop="drmCode" width="80"/>
        <el-table-column label="生产厂家" align="center" prop="drmProducerId" width="80"/>
        <el-table-column label="药品类型" align="center" prop="drmType" width="80">
          <template slot-scope="scope">
            <dict-tag :options="dict.type.drugs_drmaintain_type" :value="scope.row.drmType"/>
          </template>
        </el-table-column>
        <el-table-column label="处方类型" align="center" prop="drmPrescription" width="80">
          <template slot-scope="scope">
            <dict-tag :options="dict.type.drugs_drmaintain_prescription" :value="scope.row.drmPrescription"/>
          </template>
        </el-table-column>
        <el-table-column label="关键字" align="center" prop="drmKeyword" width="80"/>
      </el-table>
      <pagination
        v-show="total>0"
        :total="total"
        :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize"
        @pagination="getList"
      />
      <div slot="footer" class="dialog-footer" style="text-align: center">
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button type="success" @click="submitForm" size="mini">确 定</el-button>
        <el-button @click="cancel" size="mini">取 消</el-button>

      </div>
    </el-dialog>
  </div>
</template>

<script>
    import {listPureceipt, getCheck,addCheck, updateCheck} from "@/api/drugs/pureceipt";
    import {updateDrmaintains, listDrmaintain, listDrugsUnit,updateDrmaintainss} from "@/api/drugs/drm";

    export default {
        name: "ad",
        dicts: ['drugs_pureceiptlist_supplier', 'drugs_pur_pel', 'drugs_drmaintain_type', 'drugs_drmaintain_prescription'],
        data() {
            return {
                // 遮罩层
                loading: true,
                // 选中数组
                ids: [],
                // 非单个禁用
                single: true,
                // 非多个禁用
                multiple: true,
                // 显示搜索条件
                showSearch: true,
                // 总条数
                total: 0,
                // 检查费用数据
                drmaintainList: [],
                DrugsUnitList: [],
                // 弹出层标题
                title: "",
                // 是否显示弹出层
                open: false,
                // 查询参数
                queryParams: {
                    pageNum: 1,
                    pageSize: 10,
                    drmType: undefined,
                    drmPrescription: undefined,
                    purSlrName: undefined
                },
                // 表单参数
                form: {},
                forms: {}
            };
        },
        created() {
            this.getList();
            this.getLists();
        },
        methods: {
            /** 查询费用列表 */
            getList() {
                this.loading = true;
                listDrmaintain(this.queryParams).then(response => {
                    this.drmaintainList = response.rows;
                    this.total = response.total;
                    this.loading = false;
                });
            },
            /** 查询费用列表 */
            getLists() {
                this.reset();
                this.loading = true;
                listDrugsUnit(this.queryParams).then(response => {
                    this.DrugsUnitList = response.rows;
                    this.total = response.total;
                    this.loading = false;

                });
            },
            // 取消按钮
            cancel() {
                this.open = false;
                this.reset();
            },
            // 表单重置
            reset() {
                this.form = {
                    drmType: undefined,
                    drmPrescription: undefined,
                    purSlrName: undefined
                };
                this.resetForm("form");
            },
            // 多选框选中数据
            handleSelectionChange(selection) {
                this.ids = selection.map(item => item.drmId)
                this.single = selection.length != 1
                this.multiple = !selection.length
            },
            /** 新增按钮操作 */
            handleAdd() {
                this.reset();
                this.open = true;
                this.title = "添加药品信息";
            },
            /** 搜索按钮操作 */
            handleQuery() {
                this.queryParams.pageNum = 1;
                this.getList();
            },
            /** 修改按钮操作 */
            handleUpdate(row) {
                this.reset();
                const checkId = row.checkId || this.ids
                getCheck(checkId).then(response => {
                    this.form = response.data;
                    this.open = true;
                });
            },
            /** 提交按钮 */
            // submitForm: function () {
            //     this.$refs["form"].validate(valid => {
            //         if (valid) {
            //             if (this.form.checkId != undefined) {
            //                 updateCheck(this.form).then(response => {
            //                     this.$modal.msgSuccess("修改成功");
            //                     this.open = false;
            //                     this.getList();
            //                 });
            //             } else {
            //                 addCheck(this.form).then(response => {
            //                     this.$modal.msgSuccess("新增成功");
            //                     this.open = false;
            //                     this.getList();
            //                 });
            //             }
            //         }
            //     });
            // },
            submitForm: function () {
                this.$refs["form"].validate(valid => {
                    if (valid) {
                        if (this.form.checkId != undefined) {
                            updateCheck(this.form).then(response => {
                                this.$modal.msgSuccess("选择成功");
                                this.open = false;
                                this.getList();
                            });
                        }
                    }
                });
            },
            /** 删除按钮操作 */
            handleDelete(row) {
                const drmIds = row.drmId || this.ids
                this.$modal.confirm('是否确认删除公告编号为"' + drmIds + '"的数据项？').then(function () {
                    return updateDrmaintainss(drmIds);
                }).then(() => {
                    this.getLists();
                    this.$modal.msgSuccess("删除成功");
                }).catch(() => {
                });
            },
            /** 确认按钮操作 */
            submitForm(row) {
                this.reset();
                const drmIds = row.drmId || this.ids
                updateDrmaintains(drmIds).then(response => {
                    this.form = response.data;
                    this.open = false;
                    this.$modal.msgSuccess("添加成功");
                    this.getLists();
                });
                // this.reset();
                // const drmIds = row.drmId || this.ids
                // this.$modal.confirm('是否确认添加公告编号为"' + drmIds + '"的数据项？').then(function () {
                //     return updateDrmaintains(drmIds);
                // });
                // this.open = true;
                // this.title = "修改检查费用";
                // this.$modal.msgSuccess("添加成功");
            }
        }
    };
</script>
